<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>更新页面</title>
        <link rel="stylesheet" href="/app/admin/component/pear/css/pear.css" />
        <link rel="stylesheet" href="/app/admin/admin/css/reset.css" />
        <style>
            .layui-upload-img { width: 90px; height: 90px; margin: 0; }
            .pic-more { width:100%; left; margin: 10px 0px 0px 0px;}
            .pic-more li { width:90px; float: left; margin-right: 5px;}
            .pic-more li .layui-input { display: initial; }
            .pic-more li a { position: absolute; top: 0; display: block; }
            .pic-more li a i { font-size: 24px; background-color: #008800; }
            #slide-pc-priview .item_img img{ width: 90px; height: 90px;}
            #slide-pc-priview li{position: relative;}
            #slide-pc-priview li .operate{ color: #000; display: none;}
            #slide-pc-priview li .toleft{ position: absolute;top: 40px; left: 1px; cursor:pointer;}
            #slide-pc-priview li .toright{ position: absolute;top: 40px; right: 1px;cursor:pointer;}
            #slide-pc-priview li .close{position: absolute;top: 5px; right: 5px;cursor:pointer;}
            #slide-pc-priview li:hover .operate{ display: block;}
            .item-list {
                display: flex;
                flex-direction: row;
                border-bottom: 1px solid #ccc;
            }

            .item-list .item {
                width: 100px;
                height: 50px;
                line-height: 50px;
                text-align: center;
                cursor: pointer;
            }

            .item-active {
                border-bottom: 2px solid #2d8cf0;
            }

            .part {
                display:  none;
            }

            .part-0 {
                display: block;
            }

        </style>
    </head>
    <body>

        <form class="layui-form">

            <div class="mainBox">
                <ul class="item-list">
                    <li class="item item-active">基本信息</li>
                    <li class="item">属性规格</li>
                    <li class="item">详情</li>
                </ul>

                <div class="main-container mr-5">

                    <div class="part part-0">
                        <div class="layui-form-item">
                            <label class="layui-form-label">商品名称</label>
                            <div class="layui-input-block">
                                <input type="text" name="name" value="" class="layui-input">
                            </div>
                        </div>

                        <div class="layui-form-item" id="pics">
                            <div class="layui-form-label">相册图集</div>
                            <div class="layui-input-block" style="width: 70%;">
                                <div class="layui-upload">
                                    <button type="button" class="layui-btn layui-btn-primary pull-left" id="slide-pc">选择多图</button>
                                    <div class="pic-more">
                                        <ul class="pic-more-upload-list" id="slide-pc-priview">
                                            <?php foreach ($images as $image) : ?>
                                            <li class="item_img">
                                                <div class="operate">
                                                    <i class="toleft layui-icon">
                                                        <img style="width: 16px; height: 16px;" src="/app/admin/admin/images/toleft.png">
                                                    </i>
                                                    <i class="toright layui-icon">
                                                        <img style="width: 16px; height: 16px;" src="/app/admin/admin/images/toright.png">
                                                    </i>
                                                    <i  class="close layui-icon">
                                                        <img style="width: 16px; height: 16px;" src="/app/admin/admin/images/close.png">
                                                    </i>
                                                </div>
                                                <img src="<?=$image['img_url']?>" class="img" ><input type="hidden" name="images[]" value="<?=$image['img_url']?>" />
                                            </li>
                                            <?php endforeach ?>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="layui-form-item" >
                            <label class="layui-form-label">商品分类</label>
                            <div class="layui-input-block">
                                <div name="category_id" id="category_id" value="<?=$categoryIds?>" ></div>
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">商品单位</label>
                            <div class="layui-input-block">
                                <input type="text" name="unit" value="" class="layui-input">
                            </div>
                        </div>

                        <div class="layui-form-item" >
                            <label class="layui-form-label">商品标签</label>
                            <div class="layui-input-block">
                                <?php foreach ($tags as $tag) : ?>
                                <input type="checkbox" name="tag_id[]" <?php if (in_array($tag['id'], $goods_tags)) : ?> checked <?php endif ?> value="<?=$tag['id']?>" title="<?=$tag['name']?>">
                                <?php endforeach ?>
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">品牌</label>
                            <div class="layui-input-block">
                                <div name="brand_id" id="brand_id" value="" ></div>
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">是否报单商品</label>
                            <div class="layui-input-block">
                                <input type="checkbox" name="is_gift" lay-skin="switch">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">是否上架</label>
                            <div class="layui-input-block">
                                <input type="checkbox" name="is_up" lay-skin="switch">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">是否推荐</label>
                            <div class="layui-input-block">
                                <input type="checkbox" name="is_recommend" lay-skin="switch">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">是否包邮</label>
                            <div class="layui-input-block">
                                <input type="checkbox" name="free_shipping" lay-skin="switch">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">邮费</label>
                            <div class="layui-input-block">
                                <input type="text" name="shipping_fee" class="layui-input" placeholder="邮费">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">划线价</label>
                            <div class="layui-input-block">
                                <input type="text" name="market_price" class="layui-input" placeholder="划线价">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">销售价</label>
                            <div class="layui-input-block">
                                <input type="text" name="price" class="layui-input" placeholder="销售价">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">积分使用上限</label>
                            <div class="layui-input-block">
                                <input type="text" name="can_use_integral" required class="layui-input" placeholder="积分使用上限">
                            </div>
                        </div>
                    </div>

                    <div class="part part-1">

                        <div class="layui-form-item">
                            <label class="layui-form-label">规格</label>
                            <div class="layui-input-block">
                                <input type="radio" name="type" title="多规格" value="2" lay-filter="type" class="layui-input">
                                <input type="radio" name="type" title="单规格" value="1" lay-filter="type"  class="layui-input">
                            </div>
                        </div>

                        <div class="layui-form-item single">
                            <label class="layui-form-label">库存</label>
                            <div class="layui-input-block">
                                <input type="text" name="stock" class="layui-input" placeholder="库存">
                            </div>
                        </div>

                        <div class="layui-form-item multi">
                            <label class="layui-form-label">规格</label>
                            <div class="layui-input-block">
                                <table class="layui-table" id="specs">
                                    <tr>
                                        <th>规格</th>
                                        <th>规格值</th>
                                        <th>操作</th>
                                    </tr>
                                    <tr>
                                        <td>
                                            <input type="hidden" name="spec[id][]" value="<?=$specs[0]['id']??''?>">
                                            <input type="text" name="spec[name][]" value="<?=$specs[0]['name']??''?>" onblur="submitSpec(this, 'name')" placeholder="规格: 颜色，尺寸等" class="layui-input">
                                        </td>
                                        <td>
                                            <input type="text" name="spec[values][]" value="<?=$specs[0]['values']??''?>" onblur="submitSpec(this, 'value')" placeholder="多个用英文逗号隔开" class="layui-input">
                                        </td>
                                        <td>
                                            <button class="layui-btn layui-btn-normal" onclick="addSpec(event)">+</button>
                                        </td>
                                    </tr>
                                    <tr class="spec-template" style="display: none;">
                                        <td>
                                            <input type="hidden" name="spec[id][]" value="">
                                            <input type="text" name="spec[name][]" onblur="submitSpec(this, 'name')" placeholder="规格: 颜色，尺寸等" class="layui-input">
                                        </td>
                                        <td>
                                            <input type="text" name="spec[values][]" onblur="submitSpec(this, 'value')" placeholder="多个用英文逗号隔开" class="layui-input">
                                        </td>
                                        <td>
                                            <button class="layui-btn layui-btn-normal" onclick="removeSpec(event)">-</button>
                                        </td>
                                    </tr>
                                    <?php foreach ($specs as $index=>$spec): ?>
                                    <?php if ($index > 0) :?>
                                    <tr class="spec-template">
                                        <td>
                                            <input type="hidden" name="spec[id][]" value="<?=$spec['id']?>">
                                            <input type="text" name="spec[name][]" value="<?=$spec['name']?>" onblur="submitSpec(this, 'name')" placeholder="规格: 颜色，尺寸等" class="layui-input">
                                        </td>
                                        <td>
                                            <input type="text" name="spec[values][]" value="<?=$spec['values']?>" onblur="submitSpec(this, 'value')" placeholder="多个用英文逗号隔开" class="layui-input">
                                        </td>
                                        <td>
                                            <button class="layui-btn layui-btn-normal" onclick="removeSpec(event)">-</button>
                                        </td>
                                    </tr>
                                    <?php endif ?>
                                    <?php endforeach ?>
                                </table>
                            </div>
                        </div>

                        <div class="layui-form-item multi" id="sku-area" >
                            <label class="layui-form-label">SKU</label>
                            <div class="layui-input-block" id="sku">
                                <?=$sku?>
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">属性</label>
                            <div class="layui-input-block">
                                <table class="layui-table" id="attr">
                                    <tr>
                                        <th>属性</th>
                                        <th>属性值</th>
                                        <th>操作</th>
                                    </tr>
                                    <tr>
                                        <td>
                                            <input type="hidden" name="attrs[id][]" value="<?=$attrs[0]['id']??''?>">
                                            <input type="text" name="attrs[name][]" value="<?=$attrs[0]['name']??''?>" onblur="submitAttr(this, 'name')" placeholder="材质" class="layui-input">
                                        </td>
                                        <td>
                                            <input type="text" name="attrs[value][]" value="<?=$attrValues[$attrs[0]['id']??0]['value']??''?>" placeholder="纯木" class="layui-input">
                                        </td>
                                        <td>
                                            <button class="layui-btn layui-btn-normal" onclick="addAttr(event)">+</button>
                                        </td>
                                    </tr>
                                    <tr class="attr-template" style="display: none;">
                                        <td>
                                            <input type="hidden" name="attrs[id][]" value="">
                                            <input type="text" name="attrs[name][]" onblur="submitAttr(this, 'name')" placeholder="材质" class="layui-input">
                                        </td>
                                        <td>
                                            <input type="text" name="attrs[value][]" placeholder="纯木" class="layui-input">
                                        </td>
                                        <td>
                                            <button class="layui-btn layui-btn-normal" onclick="removeAttr(event)">-</button>
                                        </td>
                                    </tr>
                                    <?php foreach ($attrs as $index=>$attr) : ?>
                                    <?php if ($index > 0) : ?>
                                    <tr class="attr-template">
                                        <td>
                                            <input type="hidden" name="attrs[id][]" value="<?=$attr['id']?>">
                                            <input type="text" name="attrs[name][]" value="<?=$attr['name']?>" onblur="submitAttr(this, 'name')" placeholder="材质" class="layui-input">
                                        </td>
                                        <td>
                                            <input type="text" name="attrs[value][]" value="<?=$attrValues[$attr['id']]['value']??''?>" placeholder="纯木" class="layui-input">
                                        </td>
                                        <td>
                                            <button class="layui-btn layui-btn-normal" onclick="removeAttr(event)">-</button>
                                        </td>
                                    </tr>
                                    <?php endif ?>
                                    <?php endforeach ?>
                                </table>
                            </div>
                        </div>
                    </div>

                    <div class="part part-2">
                        <div class="layui-form-item">
                            <label class="layui-form-label">商品介绍</label>
                            <div class="layui-input-block">
                                <textarea name="content" id="content" cols="30" rows="10"></textarea>
                            </div>
                        </div>
                    </div>
                    
                </div>
            </div>

            <div class="bottom">
                <div class="button-container">
                    <button type="submit" class="pear-btn pear-btn-primary pear-btn-md" lay-submit="" lay-filter="save">
                        提交
                    </button>
                    <button type="reset" class="pear-btn pear-btn-md">
                        重置
                    </button>
                </div>
            </div>
            
        </form>

        <script src="/app/admin/component/layui/layui.js"></script>
        <script src="/app/admin/component/pear/pear.js"></script>
        <script src="/app/admin/admin/js/permission.js"></script>
        
        <script>
            let editor;

            var modelId = <?=$goods_info['model_id']?>;
            let $ = layui.jquery;

            $(function() {
                $('.item-list .item').click(function() {
                    $('.item').removeClass('item-active')
                    $(this).addClass('item-active')
                    $('.part').hide()
                    $('.part-' + $(this).index()).show()
                })
            })

            // 相关接口
            const PRIMARY_KEY = "id";
            const SELECT_API = "/app/admin/good/select" + location.search;
            const UPDATE_API = "/app/admin/good/update";
            const SELECT_NAME_API = "/app/admin/user/searchname";



            var upload = layui.upload;
            upload.render({
                elem: '#slide-pc',
                url: '/app/admin/upload/image',
                exts: 'jpg|png|jpeg',
                multiple: true,
                before: function (obj) {
                    layer.msg('图片上传中...', {
                        icon: 16,
                        shade: 0.01,
                        time: 0
                    })
                },
                done: function (res) {
                    layer.close(layer.msg());//关闭上传提示窗口
                    if (res.status == 0) {
                        return layer.msg(res.message);
                    }
                    //$('#slide-pc-priview').append('<input type="hidden" name="pc_src[]" value="' + res.filepath + '" />');
                    $('#slide-pc-priview').append('<li class="item_img"><div class="operate"><i class="toleft layui-icon"><img style="width: 16px; height: 16px;" src="/app/admin/admin/images/toleft.png"></i><i class="toright layui-icon"><img style="width: 16px; height: 16px;" src="/app/admin/admin/images/toright.png"></i><i  class="close layui-icon"><img style="width: 16px; height: 16px;" src="/app/admin/admin/images/close.png"></i></div><img src="' + res.data.url + '" class="img" ><input type="hidden" name="images[]" value="' + res.data.url + '" /></li>');
                }
            });

            //点击多图上传的X,删除当前的图片
            $("body").on("click",".close",function(){
                var li_index=$(this).closest("li").index();
                $(this).closest("li").remove();
            });
            //多图上传点击<>左右移动图片
            $("body").on("click",".pic-more ul li .toleft",function(){
                var li_index=$(this).closest("li").index();
                if(li_index>=1){
                    $(this).closest("li").insertBefore($(this).closest("ul").find("li").eq(Number(li_index)-1));
                }
            });
            $("body").on("click",".pic-more ul li .toright",function(){
                var li_index=$(this).closest("li").index();
                $(this).closest("li").insertAfter($(this).closest("ul").find("li").eq(Number(li_index)+1));
            });

            // 获取数据库记录
            layui.use(["form", "util", "popup"], function () {
                layui.form.on("radio(type)", function(data) {
                    console.log(data)
                    $('.multi').hide();
                    $('.single').hide();

                    if (data.value == 1) {
                        $('.single').show();
                    } else {
                        $('.multi').show();
                    }
                })

                let $ = layui.$;
                $.ajax({
                    url: SELECT_API,
                    dataType: "json",
                    success: function (res) {
                        
                        // 给表单初始化数据
                        layui.each(res.data[0], function (key, value) {
                            let obj = $('*[name="'+key+'"]');
                            if (key === "password") {
                                obj.attr("placeholder", "不更新密码请留空");
                                return;
                            }
                            if (key == 'type') {
                                $('input[name=type][value=' + value + ']').attr('checked', true)
                                $('.single').hide();
                                $('.multi').hide();

                                if (value == 1) {
                                    $('.single').show();
                                } else {
                                    $('.multi').show();
                                }
                                return;
                            }

                            if (typeof obj[0] === "undefined" || !obj[0].nodeName) return;
                            if (obj[0].nodeName.toLowerCase() === "textarea") {
                                obj.val(value);
                            } else {
                                obj.attr("value", value);
                            }



                            if (key == 'free_shipping' || key == 'is_up' || key == 'is_self_pickup' || key == 'is_gift' || key == 'is_recommend') {
                                obj.prop('checked', value)
                            }
                        });

                        layui.use(['tinymce'], function() {
                            var tinymce = layui.tinymce
                            editor = tinymce.render({
                                elem: "#content",
                                images_upload_url: "/app/admin/upload/image",
                                height: 400
                            });

                        });
                        
                        // 字段 创建时间 created_time
                        layui.use(["laydate"], function() {
                            layui.laydate.render({
                                elem: "#created_time",
                                type: "datetime",
                            });
                        })


                        // image
                        let input = $("#image").prev();
                        input.prev().attr("src", input.val());
                        layui.$("#attachment-choose-image").on("click", function() {
                            parent.layer.open({
                                type: 2,
                                title: "选择附件",
                                content: "/app/admin/upload/attachment?ext=jpg,jpeg,png,gif,bmp",
                                area: ["95%", "90%"],
                                success: function (layero, index) {
                                    parent.layui.$("#layui-layer" + index).data("callback", function (data) {
                                        input.val(data.url).prev().attr("src", data.url);
                                    });
                                }
                            });
                        });
                        layui.upload.render({
                            elem: "#image",
                            url: "/app/admin/upload/image",
                            acceptMime: "image/gif,image/jpeg,image/jpg,image/png",
                            done: function (res) {
                                if (res.code) {
                                    return layui.popup.failure(res.msg);
                                }
                                this.item.prev().val(res.data.url).prev().attr("src", res.data.url);
                            }
                        });

                        layui.use(["jquery", "xmSelect"], function() {
                            layui.$.ajax({
                                url: "/app/admin/goods-brand/get",
                                dataType: "json",
                                success: function (res) {
                                    let value = layui.$("#brand_id").attr("value");
                                    let initValue = value ? value.split(",") : [];
                                    layui.xmSelect.render({
                                        el: "#brand_id",
                                        name: "brand_id",
                                        initValue: initValue,
                                        data: res.data,
                                        model: {"icon":"hidden","label":{"type":"text"}},
                                        clickClose: true,
                                        radio: true,
                                    });
                                    if (res.code) {
                                        return layui.popup.failure(res.msg);
                                    }
                                }
                            });
                        });

                        layui.use(["jquery", "xmSelect"], function() {
                            layui.$.ajax({
                                url: "/app/admin/goods-model/get",
                                dataType: "json",
                                success: function (res) {
                                    let value = layui.$("#model_id").attr("value");
                                    let initValue = value ? value.split(",") : [];
                                    layui.xmSelect.render({
                                        el: "#model_id",
                                        name: "model_id",
                                        initValue: initValue,
                                        data: res.data,
                                        model: {"icon":"hidden","label":{"type":"text"}},
                                        clickClose: true,
                                        radio: true,
                                        on: function(data) {
                                            layui.$.ajax({
                                                url: "/app/admin/goods-spec/sku",
                                                method: 'POST',
                                                data: {model_id: data.arr[0].value},
                                                success: function(res2) {
                                                    $('#sku').html(res2.data);
                                                    $('#sku-area').show();
                                                }
                                            })

                                            layui.$.ajax({
                                                url: "/app/admin/goods-attr/attrs",
                                                method: 'POST',
                                                data: {model_id: data.arr[0].value},
                                                success: function(res2) {
                                                    $('#attrs').html(res2.data);
                                                    $('#attr-area').show();
                                                }
                                            })
                                        }
                                    });
                                    if (res.code) {
                                        return layui.popup.failure(res.msg);
                                    }
                                }
                            });
                        });
                        
                        
                        // ajax返回失败
                        if (res.code) {
                            layui.popup.failure(res.msg);
                        }

                        layui.form.render()
                        
                    }
                });
            });

            var timer;

            layui.$('#nickname').keyup(function() {
                clearTimeout(timer)
                var value = layui.$(this).val()
                timer = setTimeout(function() {
                    layui.$.ajax({
                        url: SELECT_NAME_API,
                        type: "POST",
                        dateType: "json",
                        data: {name: value},
                        success: function (res) {
                            if (res.code) {
                                return layui.popup.failure(res.msg);
                            }
                            layui.$('#user_id').html(res.data.html)
                            layui.form.render()
                        }
                    });
                }, 500);
            })

            function addSpec(e)
            {
                $('.spec-template:first').clone().show().appendTo('#specs');
                e.preventDefault();
            }

            function removeSpec(e)
            {
                let id = $(e.target).parent().prev().prev().find('input').first().val()
                $(e.target).parent().parent().remove()

                if (id) {
                    postRemoveSpec({id})
                }
                e.preventDefault();
            }

            function addAttr(e)
            {
                $('.attr-template:first').clone().show().appendTo('#attr');
                e.preventDefault();
            }

            function removeAttr(e)
            {
                let id = $(e.target).parent().prev().prev().find('input').first().val()
                $(e.target).parent().parent().remove()

                if (id) {
                    postRemoveAttr({id})
                }
                e.preventDefault();
            }

            //提交事件
            layui.use(["form", "popup"], function () {
                // 字段验证允许为空
                layui.form.verify({
                    phone: [/(^$)|^1\d{10}$/, "请输入正确的手机号"],
                    email: [/(^$)|^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/, "邮箱格式不正确"],
                    url: [/(^$)|(^#)|(^http(s*):\/\/[^\s]+\.[^\s]+)/, "链接格式不正确"],
                    number: [/(^$)|^\d+$/,'只能填写数字'],
                    date: [/(^$)|^(\d{4})[-\/](\d{1}|0\d{1}|1[0-2])([-\/](\d{1}|0\d{1}|[1-2][0-9]|3[0-1]))*$/, "日期格式不正确"],
                    identity: [/(^$)|(^\d{15}$)|(^\d{17}(x|X|\d)$)/, "请输入正确的身份证号"]
                });
                layui.form.on("submit(save)", function (data) {
                    data.field[PRIMARY_KEY] = layui.url().search[PRIMARY_KEY];
                    data.field.content = editor.getContent()

                    if (typeof data.field.is_self_pickup != 'undefined' && data.field.check_user_id == '') {
                        layui.popup.failure('自提商品请设置核销人');
                        return false;
                    }
                    layui.$.ajax({
                        url: UPDATE_API,
                        type: "POST",
                        dateType: "json",
                        data: data.field,
                        success: function (res) {
                            if (res.code) {
                                return layui.popup.failure(res.msg);
                            }
                            return layui.popup.success("操作成功", function () {
                                parent.refreshTable();
                                parent.layer.close(parent.layer.getFrameIndex(window.name));
                            });
                        }
                    });
                    return false;
                });
            });

            function submitSpec(obj, type) {
                let elem = $(obj);
                let name = '';
                let id = 0;
                let values = 0;
                let idElem = null;
                if (type == 'name') {
                    name = elem.val()
                    idElem = elem.prev()
                    id = elem.prev().val()
                    values = elem.parent().next().find('input').first().val()
                } else if (type == 'value') {
                    values = elem.val()
                    id = elem.parent().prev().find('input').first().val()
                    idElem = elem.parent().prev().find('input').first()
                    name = elem.parent().prev().find('input').eq(1).val()
                }

                if (values.includes("，")) {
                    layui.popup.failure('请使用英文逗号，不要输入中文逗号');
                    values = values.replaceAll("，",",")
                    elem.val(values)
                }

                if (name && values) {
                    if (id) {
                        postUpdateSpec({id, name, values})
                    } else {
                        postAddSpec({name: name, values: values, model_id: modelId}, idElem)
                    }


                }
            }

            function postAddSpec(data, obj) {
                layui.$.ajax({
                    url: "/app/admin/goods-spec/insert",
                    type: "POST",
                    dateType: "json",
                    data: data,
                    success: function (res) {
                        if (res.code) {
                            return layui.popup.failure(res.msg);
                        }

                        renderSpec()
                        obj.val(res.data.id)
                    }
                });
            }

            function postUpdateSpec(data) {
                layui.$.ajax({
                    url: "/app/admin/goods-spec/update",
                    type: "POST",
                    dateType: "json",
                    data: data,
                    success: function (res) {
                        if (res.code) {
                            return layui.popup.failure(res.msg);
                        }

                        renderSpec()

                    }
                });
            }

            function postRemoveSpec(data) {
                layui.$.ajax({
                    url: "/app/admin/goods-spec/delete",
                    type: "POST",
                    dateType: "json",
                    data: data,
                    success: function (res) {
                        if (res.code) {
                            return layui.popup.failure(res.msg);
                        }

                        renderSpec()
                    }
                });
            }

            function postRemoveAttr(data) {
                layui.$.ajax({
                    url: "/app/admin/goods-attr/delete",
                    type: "POST",
                    dateType: "json",
                    data: data,
                    success: function (res) {
                        if (res.code) {
                            return layui.popup.failure(res.msg);
                        }

                    }
                });
            }

            function renderSpec() {
                layui.$.ajax({
                    url: "/app/admin/goods-spec/sku",
                    method: 'POST',
                    data: {model_id: modelId},
                    success: function(res2) {
                        $('#sku').html(res2.data);
                        $('#sku-area').show();

                        layui.upload.render({
                            elem: ".image",
                            url: "/app/admin/upload/image",
                            acceptMime: "image/gif,image/jpeg,image/jpg,image/png",
                            done: function (res) {
                                if (res.code) {
                                    return layui.popup.failure(res.msg);
                                }
                                this.item.prev().val(res.data.url).prev().attr("src", res.data.url);
                            }
                        });
                    }
                })
            }

            layui.upload.render({
                elem: ".image",
                url: "/app/admin/upload/image",
                acceptMime: "image/gif,image/jpeg,image/jpg,image/png",
                done: function (res) {
                    if (res.code) {
                        return layui.popup.failure(res.msg);
                    }
                    this.item.prev().val(res.data.url).prev().attr("src", res.data.url);
                }
            });

            function renderAttr() {
                layui.$.ajax({
                    url: "/app/admin/goods-attr/attrs",
                    method: 'POST',
                    data: {model_id: modelId},
                    success: function(res2) {
                        $('#attrs').html(res2.data);
                        $('#attr-area').show();
                    }
                })
            }

            function submitAttr(obj, type) {
                let elem = $(obj);
                let name = '';
                let id = 0;
                let value = 0;
                let idElem = null;
                if (type == 'name') {
                    name = elem.val()
                    idElem = elem.prev()
                    id = elem.prev().val()
                    value = elem.parent().next().find('input').first().val()
                } else if (type == 'value') {
                    value = elem.val()
                    id = elem.parent().prev().find('input').first().val()
                    idElem = elem.parent().prev().find('input').first()
                    name = elem.parent().prev().find('input').eq(1).val()
                }

                if (name) {
                    if (id) {
                        postUpdateAttr({id, name})
                    } else {
                        postAddAttr({name: name, model_id: modelId}, idElem)
                    }
                }

            }

            function postAddAttr(data, obj) {
                layui.$.ajax({
                    url: "/app/admin/goods-attr/insert",
                    type: "POST",
                    dateType: "json",
                    data: data,
                    success: function (res) {
                        if (res.code) {
                            return layui.popup.failure(res.msg);
                        }

                        obj.val(res.data.id)
                    }
                });
            }

            function postUpdateAttr(data) {
                layui.$.ajax({
                    url: "/app/admin/goods-attr/update",
                    type: "POST",
                    dateType: "json",
                    data: data,
                    success: function (res) {
                        if (res.code) {
                            return layui.popup.failure(res.msg);
                        }
                    }
                });
            }



            $(document).on('click', '.delete', function() {
                $(this).parent().parent().remove();
                return false;
            })

            layui.use(["jquery", "xmSelect"], function() {
                layui.$.ajax({
                    url: "/app/admin/goods-category/get",
                    dataType: "json",
                    success: function (res) {
                        let value = layui.$("#category_id").attr("value");
                        let initValue = value ? value.split(",") : [];
                        layui.xmSelect.render({
                            // tree: {
                            //     show: true,
                            //     strict: false,
                            // },
                            el: "#category_id",
                            name: "category_id",
                            initValue: initValue,
                            data: res.data,
                            filterable: true,
                            model: {"icon":"hidden","label":{"type":"text"}},
                        });
                        if (res.code) {
                            return layui.popup.failure(res.msg);
                        }
                    }
                });
            });


        </script>

    </body>

</html>
